import { defineStore } from 'pinia'
import { ref, computed } from 'vue'
import type { Drama, Episode, LanguageOption } from '../api/drama'

export const useSubtitleRequestStore = defineStore('subtitleRequest', () => {
  // State
  const selectedDrama = ref<Drama | null>(null)
  const selectedEpisodes = ref<Episode[]>([])
  const selectedEpisode = ref<Episode | null>(null)
  const availableLanguages = ref<LanguageOption[]>([])
  const activeRequestTab = ref('episodeRequest')
  
  const episodeForm = ref({
    videoId: '',
    videoUrl: '',
    languages: [] as string[],
    sourceLanguage: 'chinese',
    includeSourceLanguage: false
  })
  
  const dramaForm = ref({
    languages: [] as string[],
    sourceLanguage: 'chinese',
    includeSourceLanguage: false
  })

  // Computed
  const selectionMode = computed(() => {
    if (selectedEpisodes.value.length > 0) return 'multi'
    if (selectedEpisode.value) return 'single'
    return 'none'
  })

  const canSubmitEpisodeRequest = computed(() => {
    return selectionMode.value !== 'none' && episodeForm.value.languages.length > 0
  })

  const canSubmitDramaRequest = computed(() => {
    return selectedDrama.value !== null && dramaForm.value.languages.length > 0
  })

  const sortedEpisodes = computed(() => {
    return [...selectedEpisodes.value].sort((a, b) => {
      const idA = Number(a.episodeId)
      const idB = Number(b.episodeId)
      if (isNaN(idA) || isNaN(idB)) {
        return String(a.episodeId).localeCompare(String(b.episodeId))
      }
      return idA - idB
    })
  })

  // Actions
  const setSelectedDrama = (drama: Drama | null) => {
    selectedDrama.value = drama
    clearSelection()
  }

  const setSelectedEpisode = (episode: Episode | null) => {
    selectedEpisode.value = episode
    selectedEpisodes.value = []
    if (episode) {
      episodeForm.value.videoId = episode.episodeId.toString()
      episodeForm.value.videoUrl = episode.videoUrl || ''
    } else {
      episodeForm.value.videoId = ''
      episodeForm.value.videoUrl = ''
    }
  }

  const setSelectedEpisodes = (episodes: Episode[]) => {
    selectedEpisodes.value = episodes
    selectedEpisode.value = null
    episodeForm.value.videoId = ''
    episodeForm.value.videoUrl = ''
  }

  const clearSelection = () => {
    selectedEpisode.value = null
    selectedEpisodes.value = []
    episodeForm.value.videoId = ''
    episodeForm.value.videoUrl = ''
  }

  const setAvailableLanguages = (languages: LanguageOption[]) => {
    availableLanguages.value = languages
  }

  const resetEpisodeForm = () => {
    episodeForm.value = {
      videoId: '',
      videoUrl: '',
      languages: [],
      sourceLanguage: 'chinese',
      includeSourceLanguage: false
    }
  }

  const resetDramaForm = () => {
    dramaForm.value = {
      languages: [],
      sourceLanguage: 'chinese',
      includeSourceLanguage: false
    }
  }

  const resetAll = () => {
    selectedDrama.value = null
    clearSelection()
    resetEpisodeForm()
    resetDramaForm()
  }

  return {
    // State
    selectedDrama,
    selectedEpisodes,
    selectedEpisode,
    availableLanguages,
    activeRequestTab,
    episodeForm,
    dramaForm,
    
    // Computed
    selectionMode,
    canSubmitEpisodeRequest,
    canSubmitDramaRequest,
    sortedEpisodes,
    
    // Actions
    setSelectedDrama,
    setSelectedEpisode,
    setSelectedEpisodes,
    clearSelection,
    setAvailableLanguages,
    resetEpisodeForm,
    resetDramaForm,
    resetAll
  }
})